<template lang="html">
  <div class="contain-body clearfix">
    <el-form ref="form" label-width="140px">
      <el-form-item label="企业关联信息：">
        <el-select style='width: 20%' v-model='type' @change='getList()'>
          <el-option :label="value" :value="key" v-for="(value, key) in mapping" :key="key"></el-option>
        </el-select>
        <div class="el-button el-button--theme pull-right">新增{{mapping[type]}}</div>
      </el-form-item>
    </el-form>
    <div class="all-cont">
      <div :is='type' :allData='tableData[type]' :type='type'></div>
      <el-pagination @current-change='this.getList(page)' layout="prev, pager, next" :total="this.totalPage">
      </el-pagination>
    </div>
  </div>
</template>

<script>
import investment from './widget/investment'
import affiche from './widget/affiche'
import brand from './widget/brand'

export default {
  props: ['data'],
  data () {
    return {
        type: 'investment',
        mapping: {
          investment: '对外投资',
          affiche: '法院信息',
          brand: '商标'
        },
        totalPage: 100,
        tableData: { // 缓存数据
          investment: [
            {id: 1, companyname: '阿里巴巴和爸爸'},
            {id: 2, companyname: '盘石爹爹和四十大盗'}
          ],
          affiche: [
            {id: 1, name: '盘石第一人民法院', afficheType: '1', afficheDate: '10-30', affiche: '李大宝'},
            {id: 2, name: '盘石第一人民法院', afficheType: '1', afficheDate: '10-30', affiche: '李大宝'},
            {id: 3, name: '盘石第一人民法院', afficheType: '1', afficheDate: '10-30', affiche: '李大宝'}
          ],
          brand: [
            {id: 1, name: '卧槽还有商标名?', number: '12456789', brandType: '类型?', date: '10-31'},
            {id: 2, name: '卧槽还有商标名?', number: '12456789', brandType: '类型?', date: '10-31'},
            {id: 3, name: '卧槽还有商标名?', number: '12456789', brandType: '类型?', date: '10-31'},
            {id: 4, name: '卧槽还有商标名?', number: '12456789', brandType: '类型?', date: '10-31'},
            {id: 5, name: '卧槽还有商标名?', number: '12456789', brandType: '类型?', date: '10-31'}
          ]
        },
        params: { // 请求参数
          investment: {
            pid: ''
          },
          affiche: {
            name: '',
            afficheType: '',
            afficheDate: '',
            affiche: ''
          },
          brand: {
            name: '',
            number: '',
            brandType: '',
            date: ''
          }
        }
    }
  },
  components: {
    investment,
    affiche,
    brand
  },
  mounted () {
    this.data.title = '企业关联信息'
  },
  methods: {
    getList (page) {
      this.$http('get', this.type, {params: this.params[this.type].assign({page: page || 1})})
      .then((data) => {
        this.totalpage = data.result.totalPage
        this.tableData[this.type] = data.result
      })
    }
  }
}
</script>

<style lang="less">
</style>
